@extends('layout.default')

@section('layout.content')

<div class="row">
    <div class="col-xs-12 align-right">
        <button class="btn btn-lg btn-primary create-user"><i class="ace-icon fa fa-user-plus"></i>报名录入</button>
        <a href="{{route('train.export',$term->id)}}" class="btn btn-lg btn-success export-user"><i class="ace-icon fa fa-file"></i>导出名单</a>
        <div class="btn-group">
          <button data-toggle="dropdown" class="btn btn-primary btn-lg btn-inverse dropdown-toggle">
            录取状态设置
            <i class="ace-icon fa fa-angle-down icon-on-right"></i>
          </button>
          <ul class="dropdown-menu dropdown-light-blue">
            <li>
              <a href="javascript:;" class="inplan green" data-status="2">录取</a>
            </li>
            <li>
              <a href="javascript:;" class="inplan red" data-status="0">未录取</a>
            </li>
            <li class="divider"></li>
            <li>
              <a href="javascript:;" class="inplan blue" data-status="1">报名成功</a>
            </li>
          </ul>
        </div>
    </div>
  </div><!-- /.row -->

  <div class="row">
    <div class="col-xs-12">
      <h5 class="header blue" style="margin-top:-15px;">
        {{ $term->type->name }} > {{$term->name}}（{{ $term->branch->name }}）
      </h5>
      <table class="table table-hover table-striped table-bordered">
        <thead>
        <tr>
          <th class="align-middle" style="width: 130px;">班级</th>
          <th class="center" style="width:60px;">计划招生</th>
          <th class="center" style="width:60px;">已报名</th>
          <th class="center" style="width:60px;">账号</th>
          <th class="align-middle" style="width:110px;">
            <label class="inline no-padding-left">
              <input id="selectAll" name="checkin" type="checkbox" class="ace ace-checkbox-2">
              <span class="lbl "> </span>
            </label>
            姓名
          </th>
          <th class="align-middle" style="width: 65px;">电话</th>
          <th class="center" style="width:50px;">积分</th>
          <th class="center" style="width:130px;">报名时间</th>
          <th class="center" style="width:60px;">报名状态</th>
          <th class="center" style="width:50px;">来源</th>
        </tr>
        </thead>
        <tbody>
          @foreach ($term->clases as $clase)
          <?php
            $count = count($clase->users);
            if($count <= 0) $count = 1;
            $rowspan = $count == 1 ? '' : "rowspan='{$count}'";
            $user = $clase->users->shift();

          ?>
            <tr class="">
              <td class="align-top train" {!! $rowspan !!}>{{ $clase->name }}</td>
              <td class="align-top-center" {!! $rowspan !!}>{{ $clase->number }}</td>
              <td class="align-top-center b" {!! $rowspan !!}>{{ isset($user)?count($clase->users)+1:'' }}</td>

              <td class="center" >{{ isset($user)?$user->account:'' }}</td>
              <td class="align-middle" >
                @if(isset($user))
                <label class="inline no-padding-left">
                  <input name="checkin" type="checkbox" data-user="{{ $user->id }}" class="ace ace-checkbox-2">
                  <span class="lbl "> </span>
                </label>
                {!! $user->info->present()->face !!}{{ $user->info->name }}
                 @if ($clase->is_handin == 1)<a class="attachment" data-id="{{$user->id}}" href="javascript:;"><i class="ace-icon fa fa-photo"></i></a> @endif
                @endif
              </td>
              <td class="align-middle" >{{ isset($user)?$user->info->mobile:'' }}</td>
              <td class="center b-sign">
                {{ isset($user)?$user->info->summary->points:'' }}
              </td>
              <td class="center">
                <span class="grey smaller-80">{{ isset($user)?$user->created_at:'' }}</span>
              </td>
              <td class="center" >{!! isset($user)?$user->present()->claseStatus():'' !!}</td>
              <td class="center" >{!! isset($user)?$user->present()->claseSource():'' !!}</td>
            </tr>

            @if($rowspan != '')
              @foreach($clase->users as $user)
              <tr class="train">
                <td class="center" >{{ $user->account }}</td>
                <td class="align-middle" >
                  <label class="inline no-padding-left">
                    <input name="checkin" type="checkbox" data-user="{{ $user->id }}" class="ace ace-checkbox-2">
                    <span class="lbl "> </span>
                  </label>
                  {!! $user->info->present()->face !!}{{ $user->info->name }}
                  @if ($clase->is_handin == 1)<a class="attachment" data-id="{{$user->id}}" href="javascript:;"><i class="ace-icon fa fa-photo"></i></a> @endif
                </td>
                <td class="align-middle" >{{ $user->info->mobile }}</td>
                  <td class="center b-sign">
                  {{ $user->info->summary->points }}
                </td>
                <td class="center">
                  <span class="grey smaller-80">{{ isset($user)?$user->created_at:'' }}</span>
                </td>
                <td class="center" >{!! $user->present()->claseStatus() !!}</td>
                <td class="center" >{!! $user->present()->claseSource() !!}</td>
              </tr>
              @endforeach
            @endif

          @endforeach
        </tbody>
      </table>
    </div>

  </div>

@stop

@section('javascript')

  <script src="//cdn.bootcss.com/jquery-validate/1.19.1/jquery.validate.min.js"></script>
  <script src="{{URL::asset('assets/js/jquery-validate-methods.js')}}"></script>
  <script src="//cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.min.js"></script>

  <script type="text/javascript">
    $(function () {

      $('.attachment').on('click', function(e) {
        var tuser = $(this).data('id');
        layer.open({
          type: 2,
          title: '查看附件',
          area: ['750px', '600px'],
          shade: 0.8,
          resize: true,
          content: "/train/attachment/"+tuser,
        });

      });


      $('.create-user').on('click', function(e) {
        var tid = $(this).data('tid');
        var uri = "{{route('train.add',$term->id)}}";;
        layer.open({
          type: 2,
          title: '报名录入',
          area: ['400px', '650px'],
          shade: 0.8,
          content: uri,
        });

      });


      //状态设置
      $('.inplan').on('click', function() {

        var that = $(this);
        var status = that.data('status');
        var term = '{{$term->id}}';
        var uri = '{{route('train.status')}}';

        var tusers = [];
        $("input[name='checkin']:checked").each(function(i){
            tusers[i] = $(this).data('user');
        });

        $.post(uri, {
          '_token':$("input[name='_token']").attr('value'),
          'term': term,
          'status': status,
          'tusers': tusers,
          'is_submit': true
        }, function(data) {
          layer.msg(data.message, { shift: -1 },function(){
            if(data.status === true && data.url != null ){
              $(window).attr('location', data.url);
            }
          });

        },'json').error(function(data){
          layer.alert(data.responseJSON.message);
        });

      });


      function setItemCheckBox(flag) {
        $(":checkbox[name=checkin]").prop("checked",flag);
      }

      $("#selectAll").click(function(){
        //1.获取全选的状态
        var flag = this.checked;//获取全选的状态
        if(flag){
          $(this).prop("checked", true);
        }else{
          $(this).prop("checked", false);
        }

        setItemCheckBox(flag);
      });

      $(":checkbox[name=checkin]").click(function(){
        var flagV = this.checked;
        if(flagV){
          $(this).prop("checked", true);
        }else{
          $(this).prop("checked", false);
        }
        //获取所有复选框的个数
        var len = $(":checkbox[name=checkin]").length;
        //获取所有被选中的复选框的个数
        var checked_len = $(":checkbox[name=checkin]:checked").length;
        if(len == checked_len){
          //alert("全选中了");
          $("#selectAll").prop("checked",true);
        } else if(checked_len == 0) {
          $("#selectAll").prop("checked",false);
        } else {
          $("#selectAll").prop("checked",false);
        }
      });


    });
  </script>
@stop
